
import { Component } from 'react'
import Taro from '@tarojs/taro'
import { View, ScrollView } from '@tarojs/components'
import { showToast, getThemeStyle } from '@/utils'
import api from '@/api'
import { SpAddress, SpLoading, SpNavBar,SpNote } from '@/components'
import { SelectInput, CommonButton } from '@/components/sp-page-components'
import { connect } from 'react-redux'
import './index.scss'



const ACTION_LIST = [
    { label: '删除', plain: true, type: 'delete' },
    { label: '编辑', plain: true, type: 'edit' }
]
const PAGE_TYPE = 'addressList'
@connect(({ planSelection }) => ({
    planSelection: planSelection.activeShop
}))
export default class Address extends Component {
    constructor() {
        super()
        this.state = {
            addressList: null,
            isActive: null,
            loading: false,
            //搜索框选择的参数  类型为对象
            inputParams: null,
            //搜索框输入的值
            inputValue: undefined,
            //筛选参数
            filterParams: null,
        }
    }
    componentDidShow() {
        this.getConfig()
    }

    notUpdate(message) {
        showToast(`${message}暂不支持修改！`)
    }
    async getConfig() {
        this.setState({
            loading: true
        })
        let synthetic = {}
        if (this.state.inputParams && this.state.inputValue) {
            synthetic[this.state.inputParams.value] = this.state.inputValue
        }
        let { distributor_id } = this.props.planSelection
        const data = {
            distributor_id,
            page_size: 1000,
            ...synthetic,
        }
        const result = await api.address.getAddressList(data)
        this.setState({
            loading: false
        })
        this.setState({
            addressList: result.list
        })
        console.log(result)
    }
    incrementAddress() {
        Taro.navigateTo({
            url: `/pages/my/address/add`
        })
    }
    async handleAction (item, { type, label }, index){
        console.Co
        if (type === 'edit') {
            Taro.setStorageSync('addressInfo', item)
            Taro.navigateTo({
                url: `/pages/my/address/add?id=${item.address_id}`
            })
        } else if (type === 'delete') {
            const { confirm } = await Taro.showModal({
                title: '确定删除？',
                content: ''
              })
              if (confirm) {
                await api.address.deleteAddressActive(item.address_id)
                this.getConfig()
              }
            
        }

    }
    switchAddressHandle(index) {
        const data = this.state.addressList.map((item, indey) => {
            if (index == indey) {
                item.is_default = '1'
            } else {
                item.is_default = '2'
            }
            return item
        })

        this.setState({
            addressList: data
        })
    }

    handleValueChange = (inputValue) => {
        this.setState({
            inputValue: inputValue
        })
    }

    handleSearchFilter = async () => {
        this.setState({
            addressList: []
        })
        this.getConfig()
    }

    handleParamChange = (inputParams) => {

        this.setState({
            inputParams: { ...inputParams }
        })
    }

    render() {
        const { inputParams, inputValue, addressList, filterParams } = this.state
        return (
            <><SpNavBar title="售后地址"> </SpNavBar>
                <View className='page-address' style={getThemeStyle()}>
                    <View className='page-address-list-input' >
                        <SelectInput
                            inputParam={inputParams}
                            inputValue={inputValue}
                            pageType={PAGE_TYPE}
                            paramChange={this.handleParamChange}
                            valueChange={this.handleValueChange}
                            onInputConfirm={this.handleSearchFilter}
                        />
                    </View>
                    {this.state.loading && <SpLoading>正在加载...</SpLoading>}
                    {this.state.addressList&&this.state.addressList.length>0 ? (
                        <ScrollView className='addressBox'>
                            {this.state.addressList.map((item, index1) => {
                                return (

                                    <View key={item.address_id} className='addressBox-address'>
                                        <View className='item'>
                                            <View className='address'>
                                                <View className='shop'>{item.name}</View>
                                                <View className='title'>
                                                    {item.province + item.city + item.area + item.address}
                                                </View>
                                                <View className='name_tel'>{item.contact + '  ' + item.mobile}</View>
                                            </View>
                                        </View>
                                        <View className='comp-item-action'>
                                            {ACTION_LIST.map((items, index) => {
                                                return (
                                                    <CommonButton
                                                        text={items.label}
                                                        size='small'
                                                        type={items.type === 'delete' ? 'danger' : 'primary'}
                                                        plain={items.plain}
                                                        key={index}
                                                        className='common-button'
                                                        onClick={() => this.handleAction(item, items, index1)}
                                                    />
                                                )
                                            })}
                                        </View>
                                    </View>


                                )
                            })}
                        </ScrollView>
                    ) : (
                        <SpNote className="note-list" img='empty.png'>暂无数据～</SpNote>
                        // <View style='text-align: center;'>暂无地址</View>
                    )}

                    <View className='confirm'>
                        <View className='btn' onClick={(e) => this.incrementAddress()}>
                            新增售后地址
                        </View>
                    </View>
                    {/* <AtFloatLayout isOpened={this.state.isShow}>
          <SpEditForm
            seletedAddress={this.seletedAddress}
            getConfig={(e) => this.getConfig()}
            isShowEditHandle={(e) => this.isShowEditHandle()}
          ></SpEditForm>
        </AtFloatLayout> */}
                </View>
            </>

        )
    }
}
